<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <!--设置字符集-->
    <meta charset="utf-8">
    <!--设置: 支持IE浏览器-->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!--
        viewport: 视口
         width=device-width  页面的宽度等于设备的宽度.
         initial-scale=1     设置缩放比(范围:1-5), 但是只针对于手机端有效.
    -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->

    <!--标题-->
    <title>Bootstrap 101 Template</title>

    <!-- 引入BootStrap样式 -->
    <link href="./bootstroop/css/bootstrap.min.css" rel="stylesheet"/>
    <link href="./bootstroop/css/bootstrap-theme.min.css" rel="stylesheet"/>
    <!-- 引入jQuery文件 -->
    <script src="./bootstroop/js/jquery-1.11.3.min.js"></script>
    <!-- 引入BootStrap的js脚本文件(插件) -->
    <script src="./bootstroop/js/bootstrap.min.js"></script>
</head>
<body>

<!--布局方式-->
<div class="container" style="width: 90%">
    <!--行-->
    <div class="row">
        <h3 class="text-center has-success">添加contact</h3>
        <form method="get" action="">
            <div class="form-group has-success">
                <label class="control-label" for="name">姓名</label>
                <input type="text" class="form-control" id="name" name="name">
            </div>
            <div class="form-group has-warning">
                <label class="control-label" for="sex">性别</label>
                <input type="text" class="form-control" id="sex" name="sex">
            </div>
            <div class="form-group has-error">
                <label class="control-label" for="age">年龄</label>
                <input type="text" class="form-control" id="age" name="age">
            </div>
            <div class="form-group has-success">
                <label class="control-label" for="address">地址</label>
                <input type="text" class="form-control" id="address" name="address">
            </div>
            <div class="form-group has-warning">
                <label class="control-label" for="qq">qq</label>
                <input type="text" class="form-control" id="qq" name="qq">
            </div>
            <div class="form-group has-error">
                <label class="control-label" for="email">email</label>
                <input type="email" class="form-control" id="email" name="email">
            </div>
            <div class="form-group has-success">
                <label class="control-label" for="createDate">生日</label>
                <input type="date" class="form-control" id="createDate" name="createDate">
            </div>
            <div class="row">
                <div class="col-md-6">
                    <button type="reset" class="btn btn-default btn-group-justified">重置</button>
                </div>
                <div class="col-md-6">
                    <button type="submit" class="btn btn-primary btn-group-justified">提交</button>
                </div>
            </div>
        </form>
    </div>
</div>
</body>
</html>